<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
        <div>
            用户名：
            <input id="username"/>
        </div>
        <div>
            密码：
            <input id="password" id="password"/>
        </div>
        <div>
            <button id="login">登录-get</button>
            <button id="loginpost">登录-post</button>
        </div>
    </div>
    
</body>
<script>
    var ologin=document.querySelector('#login');
    var ologinpost=document.querySelector('#loginpost');
    var username=document.querySelector('#username');
    var password=document.querySelector('#password');
    ologin.onclick=()=>{
        // get请求
        fetch(`/login?username=${username.value}&password=${password.value}`).then(res=>res.text()).then
        (res=>{
            console.log(res);
        })
    }

    ologinpost.onclick=()=>{
        // post请求
        fetch(`/login`,{
            method:'post',
            body:JSON.stringify({
                username:username.value,
                password:password.value
            }),
            headers:{
                'Content-Type':'application/json'
            }
        }).then(res=>res.json()).then(res=>{
            console.log(res);
            // 可以加上跳转
            if(res.ok===1){
                location.href='/home.html'
            }
        })
    }
</script>
</html>